<template>
    <div>
      <el-container>
        <el-header>小U后台大型管理系统
          <div>欢迎用户:{{ store.getters.getUser.username }}</div>
          <el-button @click="out" class='out' size="small" type="danger">退出</el-button>
        </el-header>
        <el-container>
          <el-aside>
              <v-nav></v-nav>
          </el-aside>
          <el-main>
              <router-view></router-view>
          </el-main>
        </el-container>
      </el-container>
    </div>
  </template>

<script lang="ts" setup>
import vNav from '../components/vNav.vue'
import { useRouter,useRoute } from 'vue-router';
import { useStore } from 'vuex';
let store = useStore();
let router = useRouter();
let route = useRoute();
let defaultActive = route.path
let height = '100vh';
let out = ()=>{
  store.dispatch('changeUserAction',false);
  router.push('/login')
}
</script>

<style scoped>
el-header{
    background-color: #ccc;
}
.el-menu{
  height:100vh;
}
.el-header{
  text-align: center;
  padding-top: 10px;
  background-color: aqua;
  position: relative;
}
.el-button{
  position: absolute;
  right: 43%;
  top: 32px;
}
</style>
